// 元素加载动画 延迟
export function animateDelayedElements(parentSelector: any, childSelector: any, delayTime: number) {
    const parents = document.querySelectorAll(parentSelector)
    parents.forEach((parent, index) => {
        const children = parent.querySelectorAll(childSelector)
        children.forEach((child: { style: { animationDelay: string } }, childIndex: number) => {
            child.style.animationDelay = `${delayTime + childIndex * 0.2}s`
        })
    })
}

export function createTextEffect(elementSelector: any, textClass: any, animationDuration: string, animationDelay: number) {
    const textElement: any = document.querySelector(elementSelector)
    const textContent = textElement.textContent
    const characters = textContent.split('')
    const observer = new IntersectionObserver((entries) => {
        entries.forEach((entry) => {
            if (entry.isIntersecting) {
                textElement.innerHTML = ''
                for (let i = 0; i < characters.length; i++) {
                    const character = characters[i]
                    const characterElement = document.createElement('i')
                    const characterTextNode = document.createTextNode(character)
                    characterElement.appendChild(characterTextNode)
                    characterElement.classList.add(textClass)
                    characterElement.style.animationDuration = animationDuration
                    characterElement.style.animationDelay = `calc(${i} * ${animationDelay}s)`
                    textElement.appendChild(characterElement)
                }
                observer.disconnect()
            }
        })
    })
    observer.observe(textElement)
}
